<template>
	<view class="page-message">
		<popup :title="'填写反馈信息'" @close="hide = false" :hide="hide">
			<input  placeholder="输入反馈信息" class="fd" type="text" v-model="result" />
			<view @click="submit" class="submit"></view>
		</popup>
		<view class="title">反馈消息</view>
		<topNav :isLoading="isloading" :activeIndex="activeIndex" :navtitle="navtitle" @topChange="topChange">
			<checkCard 
				:week="item.week" :className="item.className" :courseTitle="item.courseTitle" :key="index" :classes="item.classes"
				:roomName="item.roomName" :buildings="item.buildings" :room="item.room" v-for="(item,index) in records">
				<view :style="{'color': item.result ? '#4059FF' :'#FF4E5E' }" class="state">
					{{ item.result ? '已反馈' : '未反馈'}}
				</view>
				<btn :type="item.result ? 'default' : 'active'" @click="to(item)">{{ '填写'}}</btn>
			</checkCard>
		</topNav>
	</view>
</template>

<script>
	import {
		reqMessage
	} from '../../../request/feedback.js'
	import btn from '../../../components/button.vue'
	import popup from '../../../components/popup.vue'
	const navtitle = [{
			activeColor: '#FF4E5E',
			activeFont: '#FFFFFF',
			title: '7S检查'
		},
		{
			activeColor: '#4059FF',
			activeFont: '#FFFFFF',
			title: '教学检查'
		},
		{
			activeColor: '#FF6702',
			activeFont: '#FFFFFF',
			title: '自习检查'
		},
		{
			activeColor: '#3AC3AF',
			activeFont: '#FFFFFF',
			title: '寝室检查'
		},
		{
			title: '其他',
			activeColor: '#FF4E5E',
		},
	]
	import topNav from '../../../components/topNav.vue'
	import checkCard from '../../../components/chehkCard.vue'
	export default {
		data() {
			return {
				navtitle,
				activeIndex: 0,
				isloading: true,
				records: {},
				hide: false,
				id: 0,
				result:''
			}
		},
		methods: {
			async topChange(index) {
				this.isloading = true
				this.activeIndex = index;
				const res = await reqMessage(index, 'get')
				console.log(res)
				this.records = res.records
				this.isloading = false
			},
			to(item){
				if(item.result.length > 0){
					return
				}
				this.hide = !this.hide
				this.id = item.id;
			},
			async submit(){
				const res = await reqMessage(this.activeIndex,'post',{
					result:this.result,
					id:this.id
				})
				if(res == '填写成功'){
					uni.showToast({
						title: '填写成功'
					})
					this.hide = false;
					this.result = '';
				}
				console.log(res)
			}
		},
		components: {
			topNav,
			checkCard,
			btn,
			popup
		}
	}
</script>

<style lang="scss" scoped>
	.title {
		display: flex;
		height: 100px;
		align-items: center;
		font-size: 21px;
		font-family: PingFang SC;
		font-weight: bold;
		color: rgba(71, 79, 102, 1);
	}

	.page-message {
		box-sizing: border-box;
		padding: 0px 30px;
	}
	.submit{
		width: 100px;
		height: 100px;
		background-color: #4059FF;
		margin: 100px auto;
		background: url(../../../static/img/icon_selected@3x.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
	}
	.state {
		width: 39px;
		height: 13px;
		padding-left: 10px;
		font-size: 13px;
		font-family: PingFang SC;
		font-weight: bold;
		color: rgba(255, 78, 94, 1);
	}
	.fd{
		margin: 0 30px;
		height: 30px;
		background-color: #F8F8FB;
		padding: 0 10px;
	}
</style>
